<!DOCTYPE html>
<html>

	<head>
		<title>客户关系管理系统-客户信息管理</title>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />

		<link rel="stylesheet" type="text/css" href="../../css/bootstrap.min.css" />
		<link rel="stylesheet" type="text/css" href="../../css/bootstrap-theme.min.css" />
		<link rel="stylesheet" type="text/css" href="../../css/normalize.min.css" />

		<script src="../../js/jquery-3.2.1.min.js" type="text/javascript" charset="utf-8"></script>
		<script src="../../js/bootstrap.min.js" type="text/javascript" charset="utf-8"></script>

		<!--[if lte IE 8]>
			<script src="../../js/html5shiv.min.js" type="text/javascript" charset="utf-8"></script>
			<script src="../../js/respond.min.js" type="text/javascript" charset="utf-8"></script>
		<![endif]-->

		<!-- 界面自定义CSS文件 -->
		<link rel="stylesheet" type="text/css" href="../../css/custom/scrollbar-style.min.css" />
		<link rel="stylesheet" type="text/css" href="../../css/custom/html-cust-index.min.css" />

		<!--界面自定义JS文件-->
		<script src="../../js/custom/tip-popover.min.js" type="text/javascript" charset="utf-8"></script>
		<script src="../../js/custom/html-cust-index.js" type="text/javascript" charset="utf-8"></script>

	</head>

	<body>
		<div class="container-fluid">

			<!--TODO 当前页面地理位置 (面包屑导航)-->
			<ul class="breadcrumb">
				<li>客户管理</li>
				<li>客户信息管理</li>
			</ul>

			<!--TODO 搜索表单及工具按钮-->
			<form id="form-search" method="get" class="form-inline">

				<div class="form-group">
					<label class="control-label">客户编号：</label>
					<div class="input-group">
						<span class="input-group-addon">CST</span>
						<input class="form-control" type="text" />
					</div>

					<label class="control-label">名称：</label>
					<input class="form-control" type="text" />

					<label class="control-label">地区：</label>
					<select class="form-control">
						<option>全部</option>
						<option>北京</option>
						<option>华北</option>
						<option>华中</option>
						<option>西部</option>
						<option>华南</option>
					</select>
				</div>

				<div class="form-group">
					<label class="control-label">客户经理：</label>
					<input class="form-control" type="text" />

					<label class="control-label">客户等级：</label>
					<select class="form-control">
						<option>全部</option>
						<option>战略合作伙伴</option>
						<option>合作伙伴</option>
						<option>大客户</option>
						<option>普通客户</option>
					</select>
				</div>

				<div class="form-group btn-group">
					<button class="btn btn-default">
						<span class="glyphicon glyphicon-search"></span>
						查询
					</button>
				</div>

			</form>

			<hr />

			<!--TODO 数据列表-->
			<table class="table table-hover table-bordered">
				<thead class="bg-primary">
					<tr>
						<th>#</th>
						<th>客户名称</th>
						<th class="hidden-xs hidden-sm">地区</th>
						<th class="hidden-xs">客户经理</th>
						<th class="hidden-xs">等级</th>
						<th>操作</th>
					</tr>
				</thead>
				<tbody>
					<tr>
						<td>CST071202001</td>
						<td>聪海信息科技有限公司</td>
						<td class="hidden-xs hidden-sm">北京</td>
						<td class="hidden-xs">张先明</td>
						<td class="hidden-xs">战略合作伙伴</td>
						<td>
							<div class="btn-group btn-group-xs" data-id="CST071202001">
								<button class="btn btn-default" title="查看" data-toggle="modal" data-target="#modal-show">
									<span class="glyphicon glyphicon-search"></span>
									<span class="hidden-xs">查看</span>
								</button>
								<button class="btn btn-default" title="编辑" data-toggle="modal" data-target="#modal-edit">
									<span class="glyphicon glyphicon-edit"></span>
									<span class="hidden-xs">编辑</span>
								</button>
								<button class="btn btn-default" title="联系人" data-toggle="modal" data-target="#modal-linkman">
									<span class="glyphicon glyphicon-user"></span>
									<span class="hidden-xs">联系人</span>
								</button>
								<button class="btn btn-default" title="交往记录" data-toggle="modal" data-target="#modal-activites">
									<span class="glyphicon glyphicon-envelope"></span>
									<span class="hidden-xs">交往记录</span>
								</button>
								<button class="btn btn-default" title="历史订单" data-toggle="modal" data-target="#modal-order">
									<span class="glyphicon glyphicon-duplicate"></span>
									<span class="hidden-xs">历史订单</span>
								</button>
								<button class="btn btn-default lost-cust" title="流失">
									<div class="text-danger">
										<span class="glyphicon glyphicon-remove"></span>
										<span class="hidden-xs">流失</span>
									</div>
								</button>
							</div>
						</td>
					</tr>

					<tr>
						<td>CST071201008</td>
						<td>北京明科科技有限公司</td>
						<td class="hidden-xs hidden-sm">北京</td>
						<td class="hidden-xs">张先明</td>
						<td class="hidden-xs">普通客户</td>
						<td>
							<div class="btn-group btn-group-xs" data-id="CST071201008">
								<button class="btn btn-default" title="查看" data-toggle="modal" data-target="#modal-show">
									<span class="glyphicon glyphicon-search"></span>
									<span class="hidden-xs">查看</span>
								</button>
								<button class="btn btn-default" title="编辑" data-toggle="modal" data-target="#modal-edit">
									<span class="glyphicon glyphicon-edit"></span>
									<span class="hidden-xs">编辑</span>
								</button>
								<button class="btn btn-default" title="联系人" data-toggle="modal" data-target="#modal-linkman">
									<span class="glyphicon glyphicon-user"></span>
									<span class="hidden-xs">联系人</span>
								</button>
								<button class="btn btn-default" title="交往记录" data-toggle="modal" data-target="#modal-activites">
									<span class="glyphicon glyphicon-envelope"></span>
									<span class="hidden-xs">交往记录</span>
								</button>
								<button class="btn btn-default" title="历史订单" data-toggle="modal" data-target="#modal-order">
									<span class="glyphicon glyphicon-duplicate"></span>
									<span class="hidden-xs">历史订单</span>
								</button>
								<button class="btn btn-default lost-cust" title="流失">
									<div class="text-danger">
										<span class="glyphicon glyphicon-remove"></span>
										<span class="hidden-xs">流失</span>
									</div>
								</button>
							</div>
						</td>
					</tr>

					<tr>
						<td>CST071201007</td>
						<td>太阳药业</td>
						<td class="hidden-xs hidden-sm">华北</td>
						<td class="hidden-xs">旺财</td>
						<td class="hidden-xs">
							<span class="text-primary">重点开发客户</span>
						</td>
						<td>
							<div class="btn-group btn-group-xs" data-id="CST071201007">
								<button class="btn btn-default" title="查看" data-toggle="modal" data-target="#modal-show">
									<span class="glyphicon glyphicon-search"></span>
									<span class="hidden-xs">查看</span>
								</button>
								<button class="btn btn-default" title="编辑" data-toggle="modal" data-target="#modal-edit">
									<span class="glyphicon glyphicon-edit"></span>
									<span class="hidden-xs">编辑</span>
								</button>
								<button class="btn btn-default" title="联系人" data-toggle="modal" data-target="#modal-linkman">
									<span class="glyphicon glyphicon-user"></span>
									<span class="hidden-xs">联系人</span>
								</button>
								<button class="btn btn-default" title="交往记录" data-toggle="modal" data-target="#modal-activites">
									<span class="glyphicon glyphicon-envelope"></span>
									<span class="hidden-xs">交往记录</span>
								</button>
								<button class="btn btn-default" title="历史订单" data-toggle="modal" data-target="#modal-order">
									<span class="glyphicon glyphicon-duplicate"></span>
									<span class="hidden-xs">历史订单</span>
								</button>
								<button class="btn btn-default hidden" title="流失">
									<div class="text-danger">
										<span class="glyphicon glyphicon-remove"></span>
										<span class="hidden-xs">流失</span>
									</div>
								</button>
							</div>
						</td>
					</tr>

					<tr>
						<td>CST071201006</td>
						<td>云南天河烟草公司</td>
						<td class="hidden-xs hidden-sm">中南</td>
						<td class="hidden-xs">球球</td>
						<td class="hidden-xs">
							<span class="text-primary">重点开发客户</span>
						</td>
						<td>
							<div class="btn-group btn-group-xs" data-id="CST071201006">
								<button class="btn btn-default" title="查看" data-toggle="modal" data-target="#modal-show">
									<span class="glyphicon glyphicon-search"></span>
									<span class="hidden-xs">查看</span>
								</button>
								<button class="btn btn-default" title="编辑" data-toggle="modal" data-target="#modal-edit">
									<span class="glyphicon glyphicon-edit"></span>
									<span class="hidden-xs">编辑</span>
								</button>
								<button class="btn btn-default" title="联系人" data-toggle="modal" data-target="#modal-linkman">
									<span class="glyphicon glyphicon-user"></span>
									<span class="hidden-xs">联系人</span>
								</button>
								<button class="btn btn-default" title="交往记录" data-toggle="modal" data-target="#modal-activites">
									<span class="glyphicon glyphicon-envelope"></span>
									<span class="hidden-xs">交往记录</span>
								</button>
								<button class="btn btn-default" title="历史订单" data-toggle="modal" data-target="#modal-order">
									<span class="glyphicon glyphicon-duplicate"></span>
									<span class="hidden-xs">历史订单</span>
								</button>
								<button class="btn btn-default hidden" title="流失">
									<div class="text-danger">
										<span class="glyphicon glyphicon-remove"></span>
										<span class="hidden-xs">流失</span>
									</div>
								</button>
							</div>
						</td>
					</tr>

					<tr>
						<td>CST071201005</td>
						<td>北京天桥信息技术有限公司 </td>
						<td class="hidden-xs hidden-sm">北京</td>
						<td class="hidden-xs">余海</td>
						<td class="hidden-xs">大客户</td>
						<td>
							<div class="btn-group btn-group-xs" data-id="CST071201005">
								<button class="btn btn-default" title="查看" data-toggle="modal" data-target="#modal-show">
									<span class="glyphicon glyphicon-search"></span>
									<span class="hidden-xs">查看</span>
								</button>
								<button class="btn btn-default" title="编辑" data-toggle="modal" data-target="#modal-edit">
									<span class="glyphicon glyphicon-edit"></span>
									<span class="hidden-xs">编辑</span>
								</button>
								<button class="btn btn-default" title="联系人" data-toggle="modal" data-target="#modal-linkman">
									<span class="glyphicon glyphicon-user"></span>
									<span class="hidden-xs">联系人</span>
								</button>
								<button class="btn btn-default" title="交往记录" data-toggle="modal" data-target="#modal-activites">
									<span class="glyphicon glyphicon-envelope"></span>
									<span class="hidden-xs">交往记录</span>
								</button>
								<button class="btn btn-default" title="历史订单" data-toggle="modal" data-target="#modal-order">
									<span class="glyphicon glyphicon-duplicate"></span>
									<span class="hidden-xs">历史订单</span>
								</button>
								<button class="btn btn-default lost-cust" title="流失">
									<div class="text-danger">
										<span class="glyphicon glyphicon-remove"></span>
										<span class="hidden-xs">流失</span>
									</div>
								</button>
							</div>
						</td>
					</tr>
				</tbody>
			</table>

			<!--TODO 数据分页部分-->
			<div class="text-center">
				<ul class="pagination">
					<li class="disabled">
						<a>&lt;</a>
					</li>
					<li class="active">
						<a href="">1</a>
					</li>
					<li>
						<a href="">2</a>
					</li>
					<li>
						<a href="">3</a>
					</li>
					<li>
						<a href="">4</a>
					</li>
					<li>
						<a href="">5</a>
					</li>
					<li>
						<a href="">&gt;</a>
					</li>
				</ul>
			</div>
		</div>

		<!-- TODO 查看客户信息modal部分 -->
		<div class="modal fade" id="modal-show">
			<div class="modal-dialog modal-lg">
				<div class="modal-content">
					<div class="modal-header">
						<button class="close" data-dismiss="modal">
							<span class="glyphicon glyphicon-remove"></span>
						</button>
						<h3 class="modal-title">
							客户信息
							<div class="visible-xs"></div>
							<small>北京聪海信息科技有限公司</small>
						</h3>
					</div>

					<div class="modal-body">

						<table class="table table-condensed">
							<tr>
								<th class="bg-info text-right">编号</th>
								<td>CST071202001</td>
								<th class="bg-info text-right">名称</th>
								<td>北京聪海信息科技有限公司</td>
							</tr>
							<tr>
								<th class="bg-info text-right">地区</th>
								<td>北京</td>
								<th class="bg-info text-right">客户经理</th>
								<td>小明</td>
							</tr>
							<tr>
								<th class="bg-info text-right">等级</th>
								<td>战略合作伙伴</td>
								<th class="bg-info text-right">信用度</th>
								<td>
									<span class="text-success">&#x2605;&#x2605;&#x2605;&#x2605;&#x2605;</span>
								</td>
							</tr>
							<tr>
								<th class="bg-info text-right">满意度</th>
								<td colspan="3">
									<span class="text-success">&#x2606;&#x2606;&#x2606;&#x2606;&#x2606;</span>
								</td>
							</tr>
							<tr>
								<td colspan="4">&nbsp;</td>
							</tr>
							<tr>
								<th class="bg-info text-right">地址</th>
								<td>北京市海淀区成府路702号</td>
								<th class="bg-info text-right">邮编</th>
								<td>100027</td>
							</tr>
							<tr>
								<th class="bg-info text-right">电话</th>
								<td>010-62283393</td>
								<th class="bg-info text-right">传真</th>
								<td>010-62283396</td>
							</tr>
							<tr>
								<th class="bg-info text-right">主页</th>
								<td colspan="3">http://www.conghai.com</td>
							</tr>
							<tr>
								<td colspan="4">&nbsp;</td>
							</tr>
							<tr>
								<th class="bg-info text-right">营业执照注册号</th>
								<td>xxxxxxx</td>
								<th class="bg-info text-right">法人</th>
								<td>聪颖</td>
							</tr>
							<tr>
								<th class="bg-info text-right">注册资金(万元)</th>
								<td>￥1,000.00</td>
								<th class="bg-info text-right">年营业额(万元)</th>
								<td>￥3,000.00</td>
							</tr>
							<tr>
								<th class="bg-info text-right">开户银行</th>
								<td>北京银行 中关村支行</td>
								<th class="bg-info text-right">银行账号</th>
								<td>62266226****0248</td>
							</tr>
							<tr>
								<th class="bg-info text-right">地税登记号</th>
								<td></td>
								<th class="bg-info text-right">国税登记号</th>
								<td></td>
							</tr>
						</table>

					</div>

					<div class="modal-footer">
						<button class="btn btn-default" type="button" data-dismiss="modal">
							<span class="glyphicon glyphicon-remove"></span>
							关闭
						</button>
					</div>
				</div>
			</div>
		</div>

		<!--TODO 编辑客户信息modal部分-->
		<div class="modal fade" id="modal-edit">
			<div class="modal-dialog modal-lg">
				<form class="modal-content" id="form-edit">
					<div class="modal-header">
						<button class="close" data-dismiss="modal">
							<span class="glyphicon glyphicon-remove"></span>
						</button>
						<h3 class="modal-title">
							客户信息
							<div class="visible-xs"></div>
							<small>北京聪海信息科技有限公司</small>
						</h3>
					</div>

					<div class="modal-body">

						<div class="form-horizontal">

							<div class="form-group col-md-6">
								<label class="col-xs-3 col-md-2 control-label">编号</label>
								<div class="col-xs-9 col-md-10">
									<input class="form-control" value="CST071202001" hidefocus="false" readonly="readonly" />
								</div>
							</div>

							<div class="form-group col-md-6">
								<label class="col-xs-3 col-md-2 control-label">名称</label>
								<div class="col-xs-9 col-md-10">
									<input class="form-control" value="北京聪海信息科技有限公司" required="required" autofocus="autofocus" />
								</div>
							</div>

							<div class="form-group col-md-6">
								<label class="col-xs-4 col-md-3 control-label">地区</label>
								<div class="col-xs-8 col-md-9">
									<select class="form-control" required="required">
										<option value="">请选择...</option>
										<option selected>北京</option>
										<option>华北</option>
										<option>中南</option>
										<option>东北</option>
										<option>西部</option>
									</select>
								</div>
							</div>

							<div class="form-group col-md-6">
								<label class="col-xs-4 col-md-3 control-label">客户经理</label>
								<div class="col-xs-8 col-md-9">
									<select class="form-control" required="required">
										<option value="">请选择...</option>
										<option selected>小明</option>
										<option>旺财</option>
										<option>球球</option>
										<option>孙小美</option>
										<option>周洁轮</option>
									</select>
								</div>
							</div>

							<div class="form-group col-md-6">
								<label class="col-xs-4 col-md-3 control-label">信用度</label>
								<div class="col-xs-8 col-md-9">
									<select class="form-control" required="required">
										<option value="">未指定</option>
										<option value="5" selected="selected">&#x2606;&#x2606;&#x2606;&#x2606;&#x2606;</option>
										<option value="4">&#x2606;&#x2606;&#x2606;&#x2606;</option>
										<option value="3">&#x2606;&#x2606;&#x2606;</option>
										<option value="2">&#x2606;&#x2606;</option>
										<option value="1">&#x2606;</option>
									</select>
									</select>
								</div>
							</div>

							<div class="form-group col-md-6">
								<label class="col-xs-4 col-md-3 control-label">等级</label>
								<div class="col-xs-8 col-md-9">
									<select class="form-control" required="required">
										<option value="">请选择...</option>
										<option selected>战略合作伙伴</option>
										<option>合作伙伴</option>
										<option>大客户</option>
										<option>重点开发客户</option>
										<option>普通客户</option>
									</select>
								</div>
							</div>

							<div class="form-group col-md-6">
								<label class="col-xs-4 col-md-3 control-label">满意度</label>
								<div class="col-xs-8 col-md-9">
									<select class="form-control" required="required">
										<option value="">未指定</option>
										<option value="5" selected="selected">&#x2605;&#x2605;&#x2605;&#x2605;&#x2605;</option>
										<option value="4">&#x2605;&#x2605;&#x2605;&#x2605;</option>
										<option value="3">&#x2605;&#x2605;&#x2605;</option>
										<option value="2">&#x2605;&#x2605;</option>
										<option value="1">&#x2605;</option>
									</select>
									</select>
								</div>
							</div>

						</div>

						<div class="clearfix"></div>
						<hr/>

						<div class="form-horizontal">

							<div class="form-group col-md-6">
								<label class="col-xs-3 col-md-2 control-label">地址</label>
								<div class="col-xs-9 col-md-10">
									<input class="form-control" value="北京市海淀区成府路702号" />
								</div>
							</div>

							<div class="form-group col-md-6">
								<label class="col-xs-3 col-md-2 control-label">邮编</label>
								<div class="col-xs-9 col-md-10">
									<input class="form-control" value="100027" />
								</div>
							</div>

							<div class="form-group col-md-6">
								<label class="col-xs-3 col-md-2 control-label">电话</label>
								<div class="col-xs-9 col-md-10">
									<input class="form-control" value="010-62283393" type="tel" />
								</div>
							</div>

							<div class="form-group col-md-6">
								<label class="col-xs-3 col-md-2 control-label">传真</label>
								<div class="col-xs-9 col-md-10">
									<input class="form-control" value="010-62283396" type="tel" />
								</div>
							</div>

							<div class="form-group col-md-6">
								<label class="col-xs-3 col-md-2 control-label">主页</label>
								<div class="col-xs-9 col-md-10">
									<input class="form-control" value="http://www.conghai.com" type="url" />
								</div>
							</div>

						</div>

						<div class="clearfix"></div>
						<hr />

						<div class="form-horizontal">

							<div class="form-group col-md-6">
								<label class="col-xs-6 col-md-4 control-label">营业执照注册号</label>
								<div class="col-xs-6 col-md-8">
									<input class="form-control" value="xxxxxxx" />
								</div>
							</div>

							<div class="form-group col-md-6">
								<label class="col-xs-5 col-md-4 control-label">法人</label>
								<div class="col-xs-7 col-md-8">
									<input class="form-control" value="聪颖" />
								</div>
							</div>

							<div class="form-group col-md-6">
								<label class="col-xs-5 col-md-4 control-label">注册资金(万元)</label>
								<div class="col-xs-7 col-md-8">
									<input class="form-control" value="1000.00" type="number" />
								</div>
							</div>

							<div class="form-group col-md-6">
								<label class="col-xs-5 col-md-4 control-label">年营业额(万元)</label>
								<div class="col-xs-7 col-md-8">
									<input class="form-control" value="3000.00" type="number" />
								</div>
							</div>

							<div class="form-group col-md-6">
								<label class="col-xs-5 col-md-4 control-label">开户银行</label>
								<div class="col-xs-7 col-md-8">
									<input class="form-control" value="北京银行 中关村支行" />
								</div>
							</div>

							<div class="form-group col-md-6">
								<label class="col-xs-5 col-md-4 control-label">银行账号</label>
								<div class="col-xs-7 col-md-8">
									<input class="form-control" value="62266226****0248" />
								</div>
							</div>

							<div class="form-group col-md-6">
								<label class="col-xs-5 col-md-4 control-label">地税登记号</label>
								<div class="col-xs-7 col-md-8">
									<input class="form-control" />
								</div>
							</div>

							<div class="form-group col-md-6">
								<label class="col-xs-5 col-md-4 control-label">国税登记号</label>
								<div class="col-xs-7 col-md-8">
									<input class="form-control" />
								</div>
							</div>

						</div>

						<div class="clearfix"></div>

					</div>

					<div class="modal-footer">
						<button class="btn btn-default" type="button" data-dismiss="modal">
							<span class="glyphicon glyphicon-remove"></span>
							关闭
						</button>
						<button class="btn btn-primary" type="submit">
							<span class="glyphicon glyphicon-save"></span>
							更新
						</button>
					</div>
				</form>
			</div>
		</div>

		<!-- TODO 客户联系人modal部分 -->
		<div class="modal fade" id="modal-linkman">
			<div class="modal-dialog modal-lg">
				<div class="modal-content">
					<div class="modal-header">
						<button class="close" data-dismiss="modal">
							<span class="glyphicon glyphicon-remove"></span>
						</button>
						<h3 class="modal-title">
							客户联系人信息
							<div class="visible-xs"></div>
							<small>北京聪海信息科技有限公司</small>
							<small>
								<button class="btn btn-xs btn-primary" title="新增联系人" data-toggle="modal" data-backdrop="false" data-target="#modal-add-linkman">
									<span class="glyphicon glyphicon-plus"></span>
									<span class="hidden-xs">新增联系人</span>
								</button>
							</small>
						</h3>
					</div>

					<div class="modal-body">
						<table class="table table-condensed">
							<thead>
								<tr class="bg-info">
									<th>姓名</th>
									<th class="hidden-xs">性别</th>
									<th>职位</th>
									<th class="hidden-xs">办公电话</th>
									<th class="hidden-xs">移动电话</th>
									<th class="visible-xs">联系电话</th>
									<th class="hidden-xs">备注</th>
									<th>操作</th>
								</tr>
							</thead>
							<tbody>
								<tr>
									<td>沈聪林</td>
									<td class="hidden-xs">男</td>
									<td>总经理</td>
									<td class="hidden-xs">010-68348438-668</td>
									<td class="hidden-xs">13622883228</td>
									<td class="visible-xs">
										010-68348438-668
										<br />13622883228
									</td>
									<td class="hidden-xs"></td>
									<td>
										<div class="btn-group btn-group-xs" data-id="100">
											<button class="btn btn-default" data-toggle="modal" data-backdrop="false" data-target="#modal-edit-linkman">
												<span class="glyphicon glyphicon-edit"></span>
												<span class="hidden-xs">编辑</span>
											</button>
											<button class="btn btn-default del-linkman">
												<div class="text-danger">
													<span class="glyphicon glyphicon-remove"></span>
													<span class="hidden-xs">删除</span>
												</div>
											</button>
										</div>
									</td>
								</tr>

								<tr>
									<td>杨影</td>
									<td class="hidden-xs">女</td>
									<td>总经理助理</td>
									<td class="hidden-xs">010-68348438-326</td>
									<td class="hidden-xs">13728838283</td>
									<td class="visible-xs">
										010-68348438-326
										<br />13728838283
									</td>
									<td class="hidden-xs"></td>
									<td>
										<div class="btn-group btn-group-xs" data-id="101">
											<button class="btn btn-default" data-toggle="modal" data-backdrop="false" data-target="#modal-edit-linkman">
												<span class="glyphicon glyphicon-edit"></span>
												<span class="hidden-xs">编辑</span>
											</button>
											<button class="btn btn-default del-linkman">
												<div class="text-danger">
													<span class="glyphicon glyphicon-remove"></span>
													<span class="hidden-xs">删除</span>
												</div>
											</button>
										</div>
									</td>
								</tr>
							</tbody>
						</table>
					</div>

					<div class="modal-footer">
						<button class="btn btn-default" type="button" data-dismiss="modal">
							<span class="glyphicon glyphicon-remove"></span>
							关闭
						</button>
					</div>
				</div>
			</div>
		</div>

		<!-- TODO 新增客户联系人信息modal部分 -->
		<div class="modal fade" id="modal-add-linkman">
			<div class="modal-dialog">
				<form class="modal-content" id="form-add-linkman">
					<div class="modal-header">
						<button class="close" data-dismiss="modal">
							<span class="glyphicon glyphicon-remove"></span>
						</button>
						<h3 class="modal-title">
							新增客户联系人信息
							<div class="visible-xs"></div>
							<small>北京聪海信息科技有限公司</small>
						</h3>
					</div>
					<div class="modal-body container-fluid">
						<div class="row">
							<div class="form-horizontal">
								<div class="form-group form-group-sm col-md-6">
									<label class="col-xs-2 col-md-4 control-label">姓名</label>
									<div class="col-xs-10 col-md-8">
										<input class="form-control" required="required" autofocus="autofocus" />
									</div>
								</div>

								<div class="form-group form-group-sm col-md-6">
									<label class="col-xs-2 col-md-4 control-label">性别</label>
									<div class="col-xs-10 col-md-8">
										<div class="form-control-static radio">
											<label><input type="radio" name="sex" checked="checked" />男</label>
											<label><input type="radio" name="sex" />女</label>
										</div>
									</div>
								</div>

								<div class="form-group form-group-sm col-md-6">
									<label class="col-xs-2 col-md-4 control-label">职位</label>
									<div class="col-xs-10 col-md-8">
										<input class="form-control" required="required" />
									</div>
								</div>

								<div class="form-group form-group-sm col-md-6">
									<label class="col-xs-2 col-md-4 control-label">办公电话</label>
									<div class="col-xs-10 col-md-8">
										<input class="form-control" type="tel" />
									</div>
								</div>

								<div class="form-group form-group-sm col-md-6">
									<label class="col-xs-2 col-md-4 control-label">移动电话</label>
									<div class="col-xs-10 col-md-8">
										<input class="form-control" type="tel" />
									</div>
								</div>

								<div class="form-group form-group-sm col-md-6">
									<label class="col-xs-2 col-md-4 control-label">备注</label>
									<div class="col-xs-10 col-md-8">
										<textarea class="form-control"></textarea>
									</div>
								</div>
							</div>
						</div>
					</div>
					<div class="modal-footer">
						<button class="btn btn-default" type="button" data-dismiss="modal">
							<span class="glyphicon glyphicon-remove"></span>
							关闭
						</button>
						<button class="btn btn-primary" type="submit">
							<span class="glyphicon glyphicon-save"></span>
							保存
						</button>
					</div>
				</form>
			</div>
		</div>

		<!-- TODO 编辑客户联系人信息modal部分 -->
		<div class="modal fade" id="modal-edit-linkman">
			<div class="modal-dialog">
				<form class="modal-content" id="form-edit-linkman">
					<div class="modal-header">
						<button class="close" data-dismiss="modal">
							<span class="glyphicon glyphicon-remove"></span>
						</button>
						<h3 class="modal-title">
							编辑客户联系人信息
							<div class="visible-xs"></div>
							<small>北京聪海信息科技有限公司</small>
							<div class="visible-xs"></div>
							<small>-沈聪林</small>
						</h3>
					</div>
					<div class="modal-body container-fluid">
						<div class="row">
							<div class="form-horizontal">
								<div class="form-group form-group-sm col-md-6">
									<label class="col-xs-2 col-md-4 control-label">姓名</label>
									<div class="col-xs-10 col-md-8">
										<input class="form-control" value="沈聪林" required="required" autofocus="autofocus" />
									</div>
								</div>

								<div class="form-group form-group-sm col-md-6">
									<label class="col-xs-2 col-md-4 control-label">性别</label>
									<div class="col-xs-10 col-md-8">
										<div class="form-control-static radio">
											<label><input type="radio" name="sex" checked="checked" />男</label>
											<label><input type="radio" name="sex" />女</label>
										</div>
									</div>
								</div>

								<div class="form-group form-group-sm col-md-6">
									<label class="col-xs-2 col-md-4 control-label">职位</label>
									<div class="col-xs-10 col-md-8">
										<input class="form-control" value="总经理" required="required" />
									</div>
								</div>

								<div class="form-group form-group-sm col-md-6">
									<label class="col-xs-2 col-md-4 control-label">办公电话</label>
									<div class="col-xs-10 col-md-8">
										<input class="form-control" value="010-68348438-668" type="tel" />
									</div>
								</div>

								<div class="form-group form-group-sm col-md-6">
									<label class="col-xs-2 col-md-4 control-label">移动电话</label>
									<div class="col-xs-10 col-md-8">
										<input class="form-control" value="13622883228" type="tel" />
									</div>
								</div>

								<div class="form-group form-group-sm col-md-6">
									<label class="col-xs-2 col-md-4 control-label">备注</label>
									<div class="col-xs-10 col-md-8">
										<textarea class="form-control"></textarea>
									</div>
								</div>
							</div>
						</div>
					</div>
					<div class="modal-footer">
						<button class="btn btn-default" type="button" data-dismiss="modal">
							<span class="glyphicon glyphicon-remove"></span>
							关闭
						</button>
						<button class="btn btn-primary" type="submit">
							<span class="glyphicon glyphicon-edit"></span>
							更新
						</button>
					</div>
				</form>
			</div>
		</div>

		<!-- TODO 客户联交往记录modal部分 -->
		<div class="modal fade" id="modal-activites">
			<div class="modal-dialog modal-lg">
				<div class="modal-content">
					<div class="modal-header">
						<button class="close" data-dismiss="modal">
							<span class="glyphicon glyphicon-remove"></span>
						</button>
						<h3 class="modal-title">
							客户交往记录
							<div class="visible-xs"></div>
							<small>聪海信息科技有限公司</small>
							<button class="btn btn-xs btn-primary" data-toggle="modal" data-backdrop="false" data-target="#modal-add-activity">
								<span class="glyphicon glyphicon-plus"></span>
								<span class="hidden-xs">新增交往记录</span>
							</button>	
						</h3>
					</div>
					<div class="modal-body">
						<table class="table table-hover table-condensed">
							<thead>
								<tr class="bg-info">
									<th>时间</th>
									<th>主题</th>
									<th>地点</th>
									<th>详细信息</th>
									<th>操作</th>
								</tr>
							</thead>
							<tbody>
								<tr>
									<td>2018/01/09</td>
									<td>签订意向协议</td>
									<td>中电软件园</td>
									<td>... ...</td>
									<td data-id="100">
										<button class="btn btn-xs btn-danger del-activity">
											<span class="glyphicon glyphicon-remove"></span>
											<span class="hidden-xs">删除</span>
										</button>
									</td>
								</tr>
								<tr>
									<td>2018/01/10</td>
									<td>2018年行业展望座谈会</td>
									<td>中电软件园</td>
									<td>... ...</td>
									<td data-id="100">
										<button class="btn btn-xs btn-danger del-activity">
											<span class="glyphicon glyphicon-remove"></span>
											<span class="hidden-xs">删除</span>
										</button>
									</td>
								</tr>
								<tr>
									<td>2018/01/20</td>
									<td>邀请到公司参观</td>
									<td>永安小区</td>
									<td>... ...</td>
									<td data-id="100">
										<button class="btn btn-xs btn-danger del-activity">
											<span class="glyphicon glyphicon-remove"></span>
											<span class="hidden-xs">删除</span>
										</button>
									</td>
								</tr>
							</tbody>
						</table>
					</div>
					<div class="modal-footer">
						<button class="btn btn-default" type="button" data-dismiss="modal">
							<span class="glyphicon glyphicon-remove"></span>
							关闭
						</button>
					</div>
				</div>
			</div>
		</div>

		<!-- TODO 新增客户交往记录modal部分 -->
		<div class="modal fade" id="modal-add-activity">
			<div class="modal-dialog">
				<form class="modal-content" id="form-add-activity">
					<div class="modal-header">
						<button class="close" data-dismiss="modal">
							<span class="glyphicon glyphicon-remove"></span>
						</button>
						<h3 class="modal-title">
							新增客户交往记录
							<div class="visible-xs"></div>
							<small>聪海信息科技有限公司</small>
						</h3>
					</div>
					<div class="modal-body">
						<div class="form-horizontal">
							<div class="form-group form-group-sm">
								<label class="col-xs-1 col-md-2 control-label">时间</label>
								<div class="col-xs-5 col-md-4">
									<input class="form-control" type="date" required="required" autofocus="autofocus" />
								</div>
							</div>

							<div class="form-group form-group-sm">
								<label class="col-xs-2 control-label">主题</label>
								<div class="col-xs-10">
									<input class="form-control" required="required" />
								</div>
							</div>

							<div class="form-group form-group-sm">
								<label class="col-xs-2 control-label">地点</label>
								<div class="col-xs-10">
									<input class="form-control" />
								</div>
							</div>

							<div class="form-group form-group-sm">
								<label class="col-xs-2 control-label">详细信息</label>
								<div class="col-xs-10">
									<textarea class="form-control"></textarea>
								</div>
							</div>
						</div>
					</div>
					<div class="modal-footer">
						<button class="btn btn-default" type="button" data-dismiss="modal">
							<span class="glyphicon glyphicon-remove"></span>
							关闭
						</button>
						<button class="btn btn-primary" type="submit">
							<span class="glyphicon glyphicon-save"></span>
							保存
						</button>
					</div>
				</form>
			</div>
		</div>

		<!-- TODO 客户历史订单modal部分 -->
		<div class="modal fade" id="modal-order">
			<div class="modal-dialog">
				<div class="modal-content">
					<div class="modal-header">
						<button class="close" data-dismiss="modal">
							<span class="glyphicon glyphicon-remove"></span>
						</button>
						<h3 class="modal-title">
							客户历史订单
							<div class="visible-xs"></div>
							<small>聪海信息科技有限公司</small>
						</h3>
					</div>
					<div class="modal-body">
						<table class="table table-hover">
							<thead>
								<tr class="bg-info">
									<th>#</th>
									<th>日期</th>
									<th>送货地址</th>
									<th>状态</th>
									<th>操作</th>
								</tr>
							</thead>
							<tbody>
								<tr>
									<td>1343443</td>
									<td>
										<span class="visible-xs">2018/2/15<br/>15:24</span>
										<span class="hidden-xs">2018/2/15 15:24</span>
									</td>
									<td>北京海淀区劳动路205号</td>
									<td class="text-warning">未回款</td>
									<td>
										<button class="btn btn-xs btn-default" data-toggle="collapse" data-target="#order-table-1">
											<span class="glyphicon glyphicon-zoom-in"></span>
											<span class="hidden-xs">查看</span>
										</button>
									</td>
								</tr>
								<tr>
									<td colspan="5" class="order-table-parent-td">
										<div class="collapse" id="order-table-1">
											<table class="table table-bordered table-condensed">
												<thead>
													<tr class="bg-info">
														<th>商品</th>
														<th>单位</th>
														<th>数量</th>
														<th>单价(元)</th>
														<th>金额(元)</th>
													</tr>
												</thead>
												<tbody>
													<tr>
														<td>海龙笔记本电脑-i60-2688 9966</td>
														<td>台</td>
														<td>2</td>
														<td>￥10,800.00</td>
														<td>￥21,600.00</td>
													</tr>
													<tr>
														<td>海龙笔记本电脑-i61-2689 6688</td>
														<td>台</td>
														<td>2</td>
														<td>￥16,800.00</td>
														<td>￥33,600.00</td>
													</tr>
												</tbody>
												<tfoot>
													<tr>
														<th colspan="2" align="right">合计</th>
														<td>4</td>
														<td></td>
														<td>￥55,200.00</td>
													</tr>
												</tfoot>
											</table>
										</div>
									</td>
								</tr>
								<tr>
									<td>1343444</td>
									<td>
										<span class="visible-xs">2018/2/14<br/>11:31</span>
										<span class="hidden-xs">2018/2/14 11:31</span>
									</td>
									<td>北京海淀区劳动路205号</td>
									<td class="text-success">已回款</td>
									<td>
										<button class="btn btn-xs btn-default" data-toggle="collapse" data-target="#order-table-2">
											<span class="glyphicon glyphicon-zoom-in"></span>
											<span class="hidden-xs">查看</span>
										</button>
									</td>
								</tr>
								<tr>
									<td colspan="5" class="order-table-parent-td">
										<div class="collapse" id="order-table-2">
											<table class="table table-bordered table-condensed">
												<thead>
													<tr class="bg-info">
														<th>商品</th>
														<th>单位</th>
														<th>数量</th>
														<th>单价(元)</th>
														<th>金额(元)</th>
													</tr>
												</thead>
												<tbody>
													<tr>
														<td>海龙笔记本电脑-i60-2688 9966</td>
														<td>台</td>
														<td>2</td>
														<td>￥10,800.00</td>
														<td>￥21,600.00</td>
													</tr>
													<tr>
														<td>海龙笔记本电脑-i61-2689 6688</td>
														<td>台</td>
														<td>2</td>
														<td>￥16,800.00</td>
														<td>￥33,600.00</td>
													</tr>
												</tbody>
												<tfoot>
													<tr>
														<th colspan="2" align="right">合计</th>
														<td>4</td>
														<td></td>
														<td>￥55,200.00</td>
													</tr>
												</tfoot>
											</table>
										</div>
									</td>
								</tr>
								<tr>
									<td>1343445</td>
									<td>
										<span class="visible-xs">2018/2/13<br/>12:11</span>
										<span class="hidden-xs">2018/2/13 12:11</span>
									</td>
									<td>北京海淀区劳动路205号</td>
									<td class="text-success">已回款</td>
									<td>
										<button class="btn btn-xs btn-default" data-toggle="collapse" data-target="#order-table-3">
											<span class="glyphicon glyphicon-zoom-in"></span>
											<span class="hidden-xs">查看</span>
										</button>
									</td>
								</tr>
								<tr>
									<td colspan="5" class="order-table-parent-td">
										<div class="collapse" id="order-table-3">
											<table class="table table-bordered table-condensed">
												<thead>
													<tr class="bg-info">
														<th>商品</th>
														<th>单位</th>
														<th>数量</th>
														<th>单价(元)</th>
														<th>金额(元)</th>
													</tr>
												</thead>
												<tbody>
													<tr>
														<td>海龙笔记本电脑-i60-2688 9966</td>
														<td>台</td>
														<td>2</td>
														<td>￥10,800.00</td>
														<td>￥21,600.00</td>
													</tr>
													<tr>
														<td>海龙笔记本电脑-i61-2689 6688</td>
														<td>台</td>
														<td>2</td>
														<td>￥16,800.00</td>
														<td>￥33,600.00</td>
													</tr>
												</tbody>
												<tfoot>
													<tr>
														<th colspan="2" align="right">合计</th>
														<td>4</td>
														<td></td>
														<td>￥55,200.00</td>
													</tr>
												</tfoot>
											</table>
										</div>
									</td>
								</tr>
							</tbody>
						</table>
					</div>
					<div class="modal-footer">
						<button class="btn btn-default" type="button" data-dismiss="modal">
							<span class="glyphicon glyphicon-remove"></span>
							关闭
						</button>
					</div>
					</form>
				</div>
			</div>

	</body>

</html>